import { Directive, HostListener, ElementRef, OnInit, OnDestroy } from '@angular/core';

declare var $: any;

@Directive({ 
	selector: '[fixed-top]'
})


export class FixedTopDirective {

	constructor(private el: ElementRef) { }

	

	ngOnInit() {

		console.log('fixed-top');

		let top = $(this.el.nativeElement).offset().top;

		let width = $(this.el.nativeElement).width();
		console.log($(this.el.nativeElement).width());

		$(window).on('scroll', (e) => {

			if ($(window).scrollTop() < top) {

				$(this.el.nativeElement).removeClass('fixed-top-scroll');

			} else if ($(window).scrollTop() > top) {

				if ($(this.el.nativeElement).hasClass('fixed-top-scroll')) {


				} else {

					$(this.el.nativeElement).addClass('fixed-top-scroll');
					$(this.el.nativeElement).width(width+"px");
				}


			} else {
				return;
			}


		});

	}


	ngOnDestroy() {

		$(window).off('scroll');
	}

}